define(function(require, exports, module) {
  'use strict';
  var Base = require('smartartBase');

  module.exports = Base.SmartartBaseView.extend({
    initialize: function(config, options) {
      // 创建widget的时候
      var isFirstCreate = !config.itemId;

      if (isFirstCreate) {
        config.position = {top: 200, left: 100};
      }
      Base.SmartartBaseView.prototype.initialize.apply(this, arguments);

      if (isFirstCreate) {
        this.firstInit();
      }
      this.fitSize();
    },

    // 初次创建的连线题的初始化
    firstInit: function() {
      var painterWidget = this.createPainterWidget();
      var paletteWidget = this.createPaletteWidget();
      this.setData('painterIds', [painterWidget.model.get('itemId')]);
      this.setData('paletteId', paletteWidget.model.get('itemId'));
      this.makeSignalSlot();
    },

    createPainterWidget: function() {
      var widget;
      widget = this.create('item', {type: 'painter'});
      widget.model.set({
        hasSignalSlot: false,
        hasDelete: true,
        position: { top: 100, left: 0 }
      });
      this.addChild(widget);
      return widget;
    },

    createPaletteWidget: function() {
      var widget;
      widget = this.create('item', {type: 'palette'});
      widget.model.set({
        hasSignalSlot: false,
        hasDelete: false,
        position: { top: 0, left: 320 }
      });
      this.addChild(widget);
      return widget;
    },

    makeSignalSlot: function() {
      var paletteId = this.getData('paletteId');
      var painterIds = this.getData('painterIds');
      var signals = [];
      painterIds.forEach(function(painterId) {
        signals = signals.concat([
          [paletteId, 'startDrawed.palette', painterId, 'enable'],
          [paletteId, 'finishDrawed.palette', painterId, 'disable'],
          [paletteId, 'brushChanged.palette', painterId, 'setBrushStyle'],
          [paletteId, 'cleared.palette', painterId, 'clear'],
          [paletteId, 'undone.palette', painterId, 'undo'],
          [paletteId, 'redone.palette', painterId, 'redo']
        ]);
      });
      // send signal-slot to signal-slot manager
      this.sendSignalSlot(signals);
    },

    getWidgetByItemId: function(itemId) {
      return this.children.filter(function(child) {
        return child.itemId === itemId;
      })[0];
    },

    setData: function(type, value) {
      var data = this.getSelfData();
      data[type] = value;
      this.setSelfData(data);
    },

    getData: function(type) {
      var data = this.getSelfData();
      return data[type];
    },

    // hook: 当智能控件组的子控件被移除时，该方法被调用
    removeChild: function(view) {
      var painterIds, index;
      Base.SmartartBaseView.prototype.removeChild.apply(this, [view]);
      painterIds = this.getData('painterIds');
      index = painterIds.indexOf(view.itemId);
      if (index !== -1) {
        painterIds.splice(index, 1);
      }
      this.setData('painterIds', painterIds);
    },

    // 处理画板个数变化
    updatePainters: function(numberOfPainters) {
      var painterIds = this.getData('painterIds');
      var painterWidget, paletteWidget, prevPaletteWidget, index, i, length;

      // 画板个数未变
      if (numberOfPainters === painterIds.length) return;

      // 新增画板
      if (numberOfPainters > painterIds.length) {
        for (i = 0, length = numberOfPainters - painterIds.length; i < length; i++) {
          index = painterIds.length > 14 ? 14 : painterIds.length; // 防止超出页面范围
          painterWidget = this.createPainterWidget();
          painterWidget.model.set('position', { top: 100 + index * 50, left: index * 50 });
          painterWidget.trigger('fitSize');
          painterIds.push(painterWidget.model.get('itemId'));
        }
        // 将选色板替换成新的以保证选色板在前面而不至于被画板挡住
        paletteWidget = this.createPaletteWidget();
        prevPaletteWidget = this.getWidgetByItemId(this.getData('paletteId'));
        paletteWidget.model.set('position', prevPaletteWidget.model.get('position'));
        prevPaletteWidget.remove();
        this.setData('paletteId', paletteWidget.model.get('itemId'));
        this.setData('painterIds', painterIds);
        this.makeSignalSlot();
        this.fitSize();
        return;
      }

      // 减少画板
      for (i = 0, length = painterIds.length - numberOfPainters; i < length; i++) {
        painterWidget = this.getWidgetByItemId(painterIds.pop());
        painterWidget.remove();
      }
      this.setData('painterIds', painterIds);
      this.fitSize();
    },

    updateAttrOfPaletteAndPainters: function(attr, value) {
      console.log('update attr ', attr, ', value is ', value);
      var painterIds = this.getData('painterIds');
      var paletteId = this.getData('paletteId');
      for (var i = 0, length = painterIds.length; i < length; i++) {
        this.getWidgetByItemId(painterIds[i]).dataChange({name: attr, value: value}, painterIds[i], true);
      }
      this.getWidgetByItemId(paletteId).dataChange({name: attr, value: value}, paletteId, true);
    },

    // 格式化refreshUI方法的参数
    formatAttributeData: function(data) {
      var obj = {};
      data.forEach(function(item) {
        obj[item.name] = item.value;
      });
      return obj;
    },

    refreshUI: function(data) {
        var orginalData = data;

        data = this.formatAttributeData(data);

        if (data.numberOfPainters !== undefined) {
          this.updatePainters(data.numberOfPainters);
        }

        if (data.strokeColor !== undefined) {
          this.updateAttrOfPaletteAndPainters('strokeColor', data.strokeColor);
        }

        if (data.strokeWidth!== undefined) {
          this.updateAttrOfPaletteAndPainters('strokeWidth', data.strokeWidth);
        }

        if (data.paintTool!== undefined) {
          this.updateAttrOfPaletteAndPainters('paintTool', data.paintTool);
        }

        Base.SmartartBaseView.prototype.refreshUI.apply(this, [orginalData]);
    }
  });

});
